<template>
  <div class="setting">
    <van-nav-bar title="系统设置" left-arrow @click-left="$router.history.go(-1)">
      <span slot='left' class="topleftIcon"><img src='../../../public/images/qt_75.png'/></span>
    </van-nav-bar>
    <van-cell title="编辑资料"  is-link class="mt-20" @click='$router.push("/person_info")'/>
    <van-cell title="安全隐私"  is-link />
    <van-cell title="关于我们"  is-link @click='$router.push("/aboutUs")'/>
    <van-cell title="清除缓存" :value='size'  class="mt-20" @click='clearSize'/>
    <van-button size="large" style="color:#E63D40;line-height:1.16rem;height:1.16rem;" @click='loginOut'>退出登录</van-button>

  </div>
</template>

<script>
import storage from '@/common/store'
export default {
  data(){
    return{
      size:parseInt(Math.random(0,10)*10)+'MB',
    }
  },
  methods:{
    loginOut(){
      let that=this;
      this.$dialog.confirm({
        title: '提示',
        message: '确定要退出登录么？'
      }).then(() => {
        // on confirm
        that.$post(this.$api.user.logout).then(data=>{
            that.$toast.success({message:'退出成功',duration:500});
            storage.removeItem('userInfo');
            setTimeout(function(){
              that.$router.push({path:'/login'});
            },1000);
				})
      }).catch(() => {
        // on cancel
      });
    },
    clearSize(){
      let that=this;
      that.$toast.loading({mask: true,message: '加载中...',duration:600,onClose:function(){
        that.$toast.success({message:'清除成功',duration:500});
        that.size=0;
      }})
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .setting{background-color: #F5F5F5;height: 100vh;}
</style>
